<template>
    <div id="chart" v-loading="loading">
        <v-table
            :page="page"
                :pageSize="pageSize"
                :tableConfig="tableConfig"
                :tableData="tableData"
                :total="total"
                @findData="getTableData"
                @getTableData="getTableData"
                @searhData="searhData"
                @selectData="selectData"
                @setdialog="setdialog"
                @upData="getTableData"
                ref="table"
        ></v-table>
        <el-dialog
                :modal="false"
                :title="$t('in.returncondition')"
                :visible.sync="dialogVisible"
                v-dialogDrag
                width="30%">
            <v-input :detailData="inputData" :inputConfig="inputConfig" :rules="rules" ref="input"></v-input>
            <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">{{$t('common.close')}}</el-button>
            <el-button type="primary" @click="inquire">{{$t('common.search')}}</el-button>
        </span>
        </el-dialog>
    </div>

</template>

<script type="text/ecmascript-6">
    import drawer from "./deawer/Deawer"
    import tableTitle from "commons/TableTitle";
    import table from "commons/Table";
    import baseMixin from "@/mixins/BaseMixin";
    import input from "commons/Detail"

    export default {
        name: "chart",
        mixins: [baseMixin],
        data() {
            return {
                loading: false,
                tableConfig: [
                    {
                        label: this.$t('other.chartname'),
                        prop: "chartname",
                        input: "input",
                    },
                    {
                        label:  this.$t('app.remark'),
                        prop: "notes",
                        input: "input",
                    },
                ],
                tableData: [],
                pageSize: 10,
              page: 1,
                total: 0,
                tableSelectData: [],
                tableSearhData: {},
                dialogVisible: false,
                inputData: {},
                inputConfig: [
                    [
                        {
                            type: "date",
                            label: this.$t('out.starttime'),
                            props: "start",
                        },
                        {
                            type: "date",
                            label: this.$t('out.endtime'),
                            props: "end",
                        },
                        {
                            type: "input",
                            label: this.$t('outbound.user'),
                            props: "userkey",
                        }
                    ]
                ],
                rules: {}
            };
        },
        methods: {
            //选中的内容
            selectData(data) {
                this.tableSelectData = data;
            },
            async getTableData(page, data) {
                try {
                    this.loading = true;
                    let res = await this.$api.post(`/chart/${page}`, data);
                    
                        this.tableData = res.page.list;
                      this.page = res.page.curpage;
                        this.pageSize = res.page.pageSize;
                        this.total = res.page.total;
                    
                } catch (e) {
                    this.$message.error(error);
                } finally {
                    this.loading = false;
                }
            },
            //搜索的值
            searhData(data, up) {
                if (!up) {
                    this.tableSearhData = data;
                } else {
                    this.tableSearhData = data;
                    this.getTableData(1, this.tableSearhData);
                }
            },

            //设置弹框
            setdialog(data) {
                let startDate = new Date("2019/01/01 00:00:00");
                let overDate = new Date("2021/01/01 00:00:00");
                this.inputData = {
                    start: startDate.getTime(),
                    end: overDate.getTime(),
                    userkey: ""
                }
                this.dialogVisible = true
                this.$store.commit("setRouteData", data);
                // let url = sessionStorage.getItem("url");
                // let birt = sessionStorage.getItem("birtUrl");
                // this.$router.push({name: 'birtDeawer', params: {url: `${url}${birt}${data.birtrpt_url}`}});
            },
            inquire() {
                this.$router.push({name: 'chartDeawer', params: {inputData: this.inputData}});
            }
        },
        mounted() {

            this.$store.commit("setSkip", {});
            this.$store.commit("setRouteData", {});
            this.$store.commit("setNewFlag", false);
            this.getTableData(1, {});
        },
        watch: {},
        components: {
            "v-tableTitle": tableTitle,
            "v-table": table,
            "v-drawer": drawer,
            "v-input": input
        }
    };
</script>

<style scoped>
    #chart {
        width: 100%;
        height: 99%;
        padding-top: 6px;
    }
</style>
